import './layer.less';

import React from 'react';
import { config } from './config';
import { mountPlugin } from 'h5ds-mount-plugin';
import { util} from '../../h5ds-core/utils/util';

/**
 * 图层组件
 * props: layer, renderIn, plugins{pluginsKey}, isRenderThis
 */
class LayerComp extends React.Component {

  constructor(props) {
    super(props);
    this.soundId = 'id_' + util.randomID();
  }

  componentDidMount() {
    if (window.pubSubEditor == null) {
      console.log('收到h5ds. pubSubEditor null');
      return;
    }
    // console.log('注册h5ds initControl和destoryControl');
    //
    // window.pubSubEditor.subscribe('h5ds.initControl', data => {
    //   console.log('Video事件-init:', data);
    // });
    // window.pubSubEditor.subscribe('h5ds.destoryControl', data => {
    //   console.log('Video事件-destory', data);
    // });
  }

  componentWillUnmount() {
    // window.pubSubEditor.unsubscribe('h5ds.initControl');
    // window.pubSubEditor.unsubscribe('h5ds.destoryControl');
  }

  setHistory = (info = '') => {
    console.log('Video plugin， 游标', info);
  }

  render() {
    const { data } = this.props.layer;
    return (
        <div>
          <video id={this.soundId} autoPlay={false} preload="preload" src={data} height='200' controls="controls"></video>
        </div>
      )
  }
}

// 动态载入一些外部资源
const scripts = [];

mountPlugin({ LayerComp, scripts, config });

export { LayerComp, scripts, config };
